<template>
  <div>
    <div p-5>
      <TaskInfo :id="route.query.id"></TaskInfo>
      <div
        class="taskInfo-body-box"
        v-if="
          ((taskData?.nowCorrectFileUrl && taskData?.punishFileUrl) ||
            taskData?.orderCorrectFileUrl) &&
          taskData?.taskStatus == 5 &&
          taskData?.checkResult == 2
        "
      >
        <div class="taskInfo-body-box-tittle">
          <div class="taskInfo-body-box-tittle-left"></div>
          <div class="taskInfo-body-box-tittle-right">文书制作</div>
        </div>
        <div class="taskInfo-body-box-info">
          <a-row :gutter="24">
            <a-col class="gutter-row" :span="8" v-if="taskData?.nowCorrectFileUrl">
              <BookCreate
                :type="4"
                :id="id"
                :disabled="taskData?.orderCorrectFileUrl != ''"
                :url="taskData?.nowCorrectFileUrl"
                :isShow="false"
                @getBookUrl="getBookUrl"
              />
            </a-col>
            <a-col class="gutter-row" :span="8" v-if="taskData?.orderCorrectFileUrl">
              <BookCreate
                :type="5"
                :id="id"
                :disabled="taskData?.nowCorrectFileUrl != ''"
                :url="taskData?.orderCorrectFileUrl"
                :isShow="false"
                @getBookUrl="getBookUrl"
              />
            </a-col>
          </a-row>
          <a-row :gutter="24">
            <a-col class="gutter-row" :span="8" v-if="taskData?.punishFileUrl">
              <BookCreate
                :type="2"
                :id="id"
                :disabled="taskData?.orderCorrectFileUrl != ''"
                :url="taskData?.punishFileUrl"
                :isShow="false"
                @getBookUrl="getBookUrl"
              />
            </a-col>
          </a-row>
        </div>
      </div>
      <div
        class="taskInfo-body-box"
        v-if="
          (taskData?.punishType === 0 || taskData?.punishType === 1) &&
          taskData?.taskStatus == 5 &&
          taskData?.checkResult == 2
        "
      >
        <div class="taskInfo-body-box-tittle">
          <div class="taskInfo-body-box-tittle-left"></div>
          <div class="taskInfo-body-box-tittle-right">处置方式</div>
        </div>
        <div class="taskInfo-body-box-infos">
          <a-descriptions
            bordered
            :labelStyle="{ width: '160px' }"
            :content-style="{ color: '#444444' }"
          >
            <a-descriptions-item label="处置方式" :span="1">{{
              casePunishType(taskData?.punishType)
            }}</a-descriptions-item>
          </a-descriptions>
        </div>
      </div>
    </div>
    <div class="bottomBox"></div>
    <div class="bottomBtns" style="z-index: 3">
      <a-space :size="12">
        <a-button size="large" @click="cacel">取消</a-button>
        <a-button size="large" type="primary" v-if="handleShowFlag == 1" @click="taskCreate"
          >任务处理</a-button
        >
        <a-button
          size="large"
          type="primary"
          v-if="taskData?.registerType === false"
          @click="register"
          >立案</a-button
        >
      </a-space>
    </div>
  </div>
</template>
<script setup lang="ts">
  import { useRoute } from 'vue-router';
  import TaskInfo from './components/taskInfo.vue';
  import router from '@/router';
  import { onMounted, ref } from 'vue';
  import { taskxfInfo } from '@/api/supervision/task-management';
  import { getInfo } from '@/api/account';

  const route = useRoute();
  const id = route.query.id as any;
  const handleShowFlag = route.query.handleShowFlag as any;
  const userName = ref();

  const cacel = () => {
    router.push({
      path: '/supervision/supervision/task-management',
    });
  };

  const getBookUrl = async (data) => {
    console.log(data);
    if (data.code == 0) {
      const data = await taskxfInfo(route.query.id);
      taskData.value = data;
    }
  };

  const taskCreate = () => {
    router.push({
      path: '/supervision/handleTask',
      query: { id: route.query.id },
    });
  };

  const register = () => {
    router.push({
      path: '/administrative-penalty/register',
      query: { caseId: route.query.id },
    });
  };

  const casePunishType = (val) => {
    switch (val) {
      case 0:
        return '简易程序';
      case 1:
        return '一般程序';
      default:
        break;
    }
  };

  const taskData = ref();
  onMounted(async () => {
    const data = await taskxfInfo(route.query.id);
    taskData.value = data;
    const userData = await getInfo();
    userName.value = userData.userName;
  });
</script>
<style lang="less" scoped>
  .taskInfo {
    background-color: rgba(255, 255, 255, 1);
    &-body {
      &-box {
        margin-bottom: 16px;
        &-tittle {
          display: flex;
          align-items: center;
          padding: 13px 0 13px 0;
          &-left {
            border: 1px solid #0f53ac;
            margin-right: 7px;
            border-radius: 4px;
            height: 14px;
          }

          &-right {
            font-size: 16px;
            font-weight: 400;
            line-height: 24px;
            color: rgba(68, 68, 68, 1);
          }
        }
        &-info {
          :global(.ant-descriptions-item-label) {
            width: 160px;
          }
        }
      }
    }
  }
</style>
